<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Off the Record</title>
<link rel="stylesheet"
	href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
</head>
<body>
	<c:import url="../common/top.jsp"></c:import>
	<div class="container" style="margin: 60px;"></div>

	<div class="container">
		<div class="row">
			<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1"></div>

			<!--  -->
			<div class="col-xs-10 col-sm-10 col-md-10 col-lg-10">
				<div class="col-xs-3 col-sm-3 col-md-3 col-lg-3">
					<c:import url="../common/user_menu.jsp" />
				</div>
				
				
					<div class="my-review col-xs-9 col-sm-9 col-md-9 col-lg-9">
						
						<!-- 탭 -->
						<div class="bs-example bs-example-tabs" role="tabpanel">
				    		<ul id="myTab" class="nav nav-tabs" role="tablist">
				      			<li role="presentation" class="active"><a href="#home" id="home-tab" role="tab" data-toggle="tab" aria-controls="home" aria-expanded="true">내가 작성한 리뷰</a></li>
				      		</ul>
				      		
					    	<div id="myTabContent" class="tab-content">
						   		<div role="tabpanel" class="tab-pane fade in active" id="home" aria-labelledBy="home-tab">
						   			
						   			<div class="user-review col-lg-12" style="padding: 10px;">
						   			<!-- user-review -->
									<c:if test="${fn:length(crv) != 0}">
									<!-- review -->
						<c:forEach items="${crv }" var="crv">
							<!-- user -->
							<div class="user-info col-xs-3 col-sm-3 col-md-3 col-xs-3" style="border: 1px solid lightgray; padding: 10px;">
							
								<%-- <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12" style="border: 1px solid lightgray; padding: 10px;">
									<strong>${crv.key }</strong>
								</div> --%>
								
								<div class="col-xs-12" style="padding: 10px;">
									${crv.value[0].companyReviewVerifyVO.companyReviewVO.companyVo.companyName}<br>
									<br>
									<div
										class="company-score col-xs-12 col-sm-12 col-md-12 col-lg-12" style="padding: 10px;">
										<div
											class="company-score-bar col-6-xs col-6-sm col-6-md col-6-lg">
											승진 및 기회 : 
											<div class="progress">
												
												<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="100" aria-valuemin="0"
													aria-valuemax="100" style="height: 20px; width: ${crv.value[0].companyReviewVerifyVO.companyReviewVO.scoreVo.scoreChance*20}%;">
													<!-- <span class="company-score-bar" style="font: black;"></span> -->
												</div>
											</div>
											복지 및 급여 : 
											<div class="progress">
												<div class="progress-bar progress-bar-info"
													role="progressbar" aria-valuenow="100" aria-valuemin="0"
													aria-valuemax="100"
													style="width: ${crv.value[0].companyReviewVerifyVO.companyReviewVO.scoreVo.scoreWelfare*20}%;">
													<span class="company-score-bar"></span>
												</div>
											</div>
											사내 문화 : 
											<div class="progress">
												<div class="progress-bar progress-bar-info"
													role="progressbar" aria-valuenow="100" aria-valuemin="0"
													aria-valuemax="100"
													style="width: ${crv.value[0].companyReviewVerifyVO.companyReviewVO.scoreVo.scoreCulture*20}%;">
													<span class="company-score-bar"></span>
												</div>
											</div>
											휴가 자율성 : 
											<div class="progress">
												<div class="progress-bar progress-bar-info"
													role="progressbar" aria-valuenow="100" aria-valuemin="0"
													aria-valuemax="100"
													style="width: ${crv.value[0].companyReviewVerifyVO.companyReviewVO.scoreVo.scoreHoliday*20}%;">
													<span class="company-score-bar"></span>
												</div>
											</div>
											초과근무 : 
											<div class="progress">
												<div class="progress-bar progress-bar-danger"
													role="progressbar" aria-valuenow="100" aria-valuemin="0"
													aria-valuemax="100"
													style="width: ${crv.value[0].companyReviewVerifyVO.companyReviewVO.scoreVo.scoreOverdue*20}%">
													<span class="company-score-bar"></span>
												</div>
											</div>
											경영진 : 
											<div class="progress">
												<div class="progress-bar progress-bar-warning"
													role="progressbar" aria-valuenow="100" aria-valuemin="0"
													aria-valuemax="100"
													style="width: ${crv.value[0].companyReviewVerifyVO.companyReviewVO.scoreVo.scoreExecutive*20}%">
													<span class="company-score-bar"></span>
												</div>
											</div>
										</div>
									</div>
									<!-- End company-score -->
								</div>
							</div>

							<!-- 내가 쓴 리뷰 -->


							<!-- review -->
							<div class="review col-xs-9 col-sm-9 col-md-9 col-xs-9" style="padding: 10px;">
								<!-- 작성일자 -->
								<div class="review-btn col-sm-12 col-md-12 col-lg-12" style="padding: 10px;">
									<strong>${crv.value[0].companyReviewVerifyVO.companyReviewVO.companyReviewWriteDate}</strong>
								</div>
								<!-- 작성일자 -->
								
								<!-- 리뷰 -->
								<div class="review col-xs-12 col-sm-12 col-md-12 col-lg-12" style="border: 1p solid lightgray; padding: 10px;">	
								
									<div class="review-review col-xs-12 col-sm-12 col-md-12 col-lg-12">
										<pre><p class="text-success"><strong>리뷰 : </strong></p>${crv.value[0].companyReviewVerifyVO.companyReviewContents}</pre>
									</div>
						
									<div class="review-p-c col-xs-12 col-sm-12 col-md-12 col-lg-12" style="padding-bottom: 10px;">
										<button class="btn btn-primary btn-xs disabled" onclick="#">진실</button>
										<span class="badge">${crv.value[0].t}</span> /
										<button class="btn btn-danger btn-xs disabled" onclick="#">거짓</button>
										<span class="badge">${crv.value[0].o}</span>
									</div>
								</div>
								
								<!-- 장점 -->
								<div class="review-p col-xs-12 col-sm-12 col-md-12 col-lg-12" style="padding: 10px;">
									<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
										<pre><p class="text-primary"><strong>장점 : </strong></p>${crv.value[1].companyReviewVerifyVO.companyReviewContents}</pre>
									</div>
								
								<div class="review-p-p-c col-xs-12 col-sm-12 col-md-12 col-lg-12" style="padding-bottom: 10px;">
									
				
									<button class="btn btn-primary btn-xs disabled" onclick="#">진실</button>
									<span class="badge">${crv.value[1].t}</span> /
									<button class="btn btn-danger btn-xs disabled" onclick="#">거짓</button>
									<span class="badge">${crv.value[1].o}</span>


								</div>
							</div>
							
							<!-- 단점 -->
							<div class="review-c col-xs-12 col-sm-12 col-md-12 col-lg-12" style="padding: 10px;">
								
								<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
									<pre><p class="text-danger"><strong>단점 : </strong></p>${crv.value[2].companyReviewVerifyVO.companyReviewContents}</pre>
								</div>
								
								<div class="review-p-p-c col-xs-12 col-sm-12 col-md-12 col-lg-12" style="padding-bottom: 10px;">
									<button class="btn btn-primary btn-xs disabled" onclick="#">진실</button>
									<span class="badge">${crv.value[1].t}</span> /
									<button class="btn btn-danger btn-xs disabled" onclick="#">거짓</button>
									<span class="badge">${crv.value[1].o}</span>
								</div>

							</div>

							<!-- 리뷰 -->

							<!-- 작성자 작성일자 평점 순위 -->
							<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12"
								style="padding-top: 10px;">
								<button class="btn btn-default btn-sm" style="float: right;" onclick="location.href='/OffTheRecord/deleteMyReview.action?companyReviewId=${crv.value[0].companyReviewVerifyVO.companyReviewVO.companyReviewId}'">삭제</button>
							</div>
							
							<p><hr></p>
							</div><!-- End user-review -->
							
						</c:forEach>
					
				</c:if>
										<!-- 리뷰가 없을 때 -->
										<c:if test="${fn:length(crv) == 0}">
											<div class="my-review col-xs-9 col-sm-9 col-md-9 col-lg-9" style="padding: 10px;">
												<div class="jumbotron">
													<h3 align="center">작성하신 리뷰가 없습니다.</h3>
													<p align="center"><button type="button" class="btn btn-danger" onclick="location.href='/OffTheRecord/getAllList.action'" >기업 리뷰 작성하러가기</button></p>
												</div>
											</div>
										</c:if><!-- 리뷰가 없을 때 -->
							   		</div>
								</div>
						    </div>
						    <div align="center">
								<c:forEach var="i" begin="1" end="${page }">
								<c:choose>
                                       <c:when test="${nowPage != i}">
                                          <a href="/OffTheRecord/getAllCompanyReviewByUserId.action?pageNo=${i}">${i}</a>
                                       </c:when>
                                       <c:otherwise>
                                       ${i}
                                       </c:otherwise>
                                    </c:choose>
									&nbsp;
								</c:forEach>
							</div>
							</div><!-- End 탭 -->
			<!-- ##### review ##### -->

			</div>
			<!--  -->

			<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1"></div>
		</div>
		<!-- row -->
	</div>
	</div>
	<!-- container -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
</body>
</html>